import { IWidget, IOption, EnumProperty } from "xcore/cmpnt";

var ColorSelect: IWidget & IOption = {
  cmpnt: "x-color-select",
  valueKey: "color",
  category: "bars",
  props: {
    multiple: false,
    clearable: true,
    placeholder: "请选择颜色",
    style: { width: "100%" },
    class: [],
    bind: { properties: [EnumProperty.Removed] },
    options: [
      { value: "#FFFFFF", label: "white" },       // 白色，最浅
      { value: "#fafafa", label: "#fafafa" },     // 接近白色
      { value: "#f4f9fd", label: "#f4f9fd" },     // 浅蓝色
      { value: "#CCFFFF", label: "#CCFFFF" },     // 浅青色
      { value: "#FFFFCC", label: "#FFFFCC" },     // 浅黄色
      { value: "#FFFF99", label: "#FFFF99" },     // 浅黄色
      { value: "#CCFFCC", label: "#CCFFCC" },     // 浅绿色
      { value: "#CCFF99", label: "#CCFF99" },     // 浅绿色
      { value: "#99CCCC", label: "#99CCCC" },     // 浅青色
      { value: "#99CC99", label: "#99CC99" },     // 浅绿色
      { value: "#99CC66", label: "#99CC66" },     // 浅绿色
      { value: "#CCCCFF", label: "#CCCCFF" },     // 浅紫色
      { value: "#CCCCCC", label: "#CCCCCC" },     // 浅灰色
      { value: "#CCCC66", label: "#CCCC66" },     // 浅黄色
      { value: "#CCCC33", label: "#CCCC33" },     // 浅黄色
      { value: "#CCCC00", label: "#CCCC00" },     // 浅黄色
      { value: "#99CC33", label: "#99CC33" },     // 浅绿色
      { value: "#669933", label: "#669933" },     // 绿色
      { value: "#33CC33", label: "#33CC33" },     // 绿色
      { value: "#00CC00", label: "#00CC00" },     // 绿色
      { value: "#6666CC", label: "#6666CC" },     // 蓝色
      { value: "#3399CC", label: "#3399CC" },     // 蓝色
      { value: "#0066CC", label: "#0066CC" },     // 蓝色
      { value: "#336699", label: "#336699" },     // 深蓝色
      { value: "#003366", label: "#003366" },     // 深蓝色
      { value: "#333366", label: "#333366" },     // 深蓝色
      { value: "#336666", label: "#336666" },     // 深绿色
      { value: "#003333", label: "#003333" },     // 深绿色
      { value: "#666600", label: "#666600" },     // 深黄色
      { value: "#999966", label: "#999966" },     // 深黄色
      { value: "#996633", label: "#996633" },     // 棕色
      { value: "#CC9933", label: "#CC9933" },     // 橙色
      { value: "#CC6600", label: "#CC6600" },     // 橙色
      { value: "#FFCC00", label: "#FFCC00" },     // 橙色
      { value: "#FF9900", label: "#FF9900" },     // 橙色
      { value: "#FFCC99", label: "#FFCC99" },     // 浅橙色
      { value: "#663300", label: "#663300" },     // 深棕色
      { value: "#993399", label: "#993399" },     // 紫色
      { value: "#666666", label: "#666666" },     // 灰色
      { value: "#777777", label: "#777777" },     // 灰色
      { value: "#999999", label: "#999999" },     // 灰色
      { value: "#000000", label: "#000000" }      // 黑色，最深
    ],
  },
  events: {},
  ctl: {
    icon: "iconfont te-i-select",
    name: "ColorSelect",
    group: "bars",
    text: "颜色选择",
  },
};
export { ColorSelect };
